<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Title</title>
<style>
body {
	text-align: center;
}

select {
	height: 38px;
	line-height: 1.3;
	line-height: 38px\9;
	border-width: 1px;
	border-style: solid;
	background-color: #fff;
	border-radius: 2px;
	width: 100%;
}

.iCss {
	color: red;
	padding-right: 5px;
}

.row {
	margin-top: 10px;
}

.hidden {
	display: none;
}
</style>
<link rel="stylesheet" href="/Hospital/lib/layui-v2.1.6/layui/css/layui.css">
<body>
	<div id="accountTable" class="layui-form layui-container" style="">
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工账号: </span>
			</div>
			<div class="layui-col-xs5">
				<input type="text" name="account" lay-verify="required" class="layui-input" placeholder="请输入账号">
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工密码: </span>
			</div>
			<div class="layui-col-xs5">
				<input type="password" name="pwd" lay-verify="required" class="layui-input" placeholder="请输入密码">
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">确认密码: </span>
			</div>
			<div class="layui-col-xs5 ">
				<input type="password" name="pwd2" lay-verify="required" class="layui-input" placeholder="请输入密码">
			</div>
		</div>
		<input id="nextSubmit" style="display:none" type="button" lay-submit lay-filter="next">
		<div class="layui-row row">
			<button class="layui-btn layui-btn-radius layui-btn-normal" id="nextButton">下一步</button>
		</div>
	</div>


	<div id="div_alterEmployee" class="layui-form layui-container hidden" style="">
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工姓名: </span>
			</div>
			<div class="layui-col-xs5">
				<input type="text" name="name" lay-verify="required" class="layui-input" placeholder="请输入名称">
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工工号: </span>
			</div>
			<div class="layui-col-xs5">
				<input type="text" name="employeeCode" lay-verify="required" class="layui-input" placeholder="请输入工号">
			</div>
		</div>

		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1 layui-col-md2 layui-col-md-offset2">
				<span class="layui-form-label"><i class="iCss">*</i>性别: </span>
			</div>
			<div class="layui-col-xs5">
				<select name="sex" lay-verify="required" lay-search id="sex">
					<option value="0">男</option>
					<option value="1">女</option>
				</select>
			</div>

		</div>

		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">出生日期: </span>
			</div>
			<div class="layui-col-xs5 ">
				<input id="birthdate" name="birthdate" class="layui-input" type="text" readonly>
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工职位: </span>
			</div>
			<div class="layui-col-xs5 ">
				<select name="position" lay-verify="required" lay-serach="" id="positionSelect">
					<option value="">直接选择或者搜索选择</option>
				</select>
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工科室: </span>
			</div>
			<div class="layui-col-xs5 ">
				<select name="department" lay-verify="required" lay-search id="departmentSelect">
					<option value=""></option>
				</select>
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">员工状态: </span>
			</div>
			<div class="layui-col-xs5 ">
				<select name="isOnJob" lay-verify="required" lay-search id="isOnJobSelect">
					<option value="0">在职</option>
					<option value="1">离职</option>
				</select>
			</div>
		</div>
		<div class="layui-row row">
			<div class="layui-col-xs4 layui-col-xs-offset1">
				<span class="layui-form-label">跨域访问: </span>
			</div>
			<div class="layui-col-xs5 ">
				<select name="isDomain" lay-verify="required" lay-search id="isDomainSelect">
					<option value="0">允许</option>
					<option value="1">不允许</option>
				</select>
			</div>
		</div>
		<input id="submit" style="display:none" type="button" lay-submit lay-filter="*">
	</div>

</body>
<script type="text/javascript" src="/Hospital/lib/jquery.min.js"></script>
<script type="text/javascript" src="/Hospital/lib/layui-v2.1.6/layui/layui.js"></script>
<script type="text/javascript" src="/Hospital/resources/js/util.js"></script>
<script>
	var isSuccess = 0; //判断是否新增成功
	//判断增加、编辑操作
	var operator = localStorage.getItem("employeeManager_operator");
	localStorage.removeItem("employeeManager_operator");
	
	layui.use([ 'form', 'laydate' ], function() {
		var form = layui.form;
		var laydate = layui.laydate; //调用Layui插件里的时间组件
		var $ = layui.jquery;
		form.render(); //layui form表单更新渲染
		initFrame();
		
		form.verify({ //表单验证
			age : function(value, item) { //value表单的值，item表单的DOM对象
				if (parseFloat(value) < 0 || parseFloat(value) > 100) {
					return "格式错误！年龄范围(0-100)";
				}
			}
		});
		
		
		function initFrame() {
			initBirthdate(); //初始化出生日期控件
			listen(); //监听事件
			formDataRender();//请求数据到form表单并且更新渲染
			initAlterFrame();//编辑按钮打开此页面时获取数据并初始化
		}
		
		function initBirthdate() {
			var max = formatDate(new Date());
			//console.log("addEmployee.html/initBirthdate.max");
			//console.log(max);
			laydate.render({ //执行一个laydate实例
				elem : '#birthdate', //指定元素
				theme : "#55565b",
				max : max,
			});
		}

		function formDataRender() {
			var clinicId = JSON.parse(localStorage.getItem("loginUser")).clinicId; //获取当前门诊ID
			var data = {
				clinicId : clinicId
			};
			$.ajax({
				data : data,
				type : 'POST',
				url : "/Hospital/clinicController/getClinicAllDepartment",
				async : false,
				success : function(result) {
					if (result.code == 200) {
						var data = result.result;
						//console.log("formDataRender.result");
						//console.log(result);
						for (var i = 0; i < data.length; i++) {
							$('#departmentSelect').append(
									"<option value='"+data[i].departmentId+"'>"
											+ data[i].departmentName + "</option>");
							form.render('select');
						}
					} else {
						console.log(result);
					}
				}
			});
			$.ajax({
				type : 'POST',
				url : "/Hospital/permissionController/getAllPosition",
				async : false,
				success : function(result) {
					if (result.code == 200) {
						var data = result.result;
						for (var i = 0; i < data.length; i++) {
							$('#positionSelect').append(
									"<option value='"+data[i].positionId+"'>"
											+ data[i].positionName + "</option>");
							form.render('select');
						}
					} else {
						console.log(result);
					}
				}
			});
		}
		function initAlterFrame() {
			//用户数据
			var editData = JSON.parse(localStorage.getItem("editTableData"));
			if (editData != null && operator == 1) {
				$("input[name='account']").val(editData.account);
				$("input[name='pwd']").val(editData.pwd);
				$("input[name='name']").val(editData.name);
				$("input[name='employeeCode']").val(editData.employeeCode);
				if(editData.birthdate == "1000-01-01") {
					$("input[name='birthdate']").val("");
				}else {
					$("input[name='birthdate']").val(editData.birthdate);
				}
				$("#sex").val(editData.sexInt);
				$("#positionSelect").val(editData.positionId);
				$("#departmentSelect").val(editData.departmentId);
				$("#isOnJobSelect option").eq(editData.isOnJobInt).attr("selected", true);
				$("#isDomainSelect option").eq(editData.isDomainInt).attr("selected", true);
				form.render('select');
				$('#accountTable').css({
					'display' : 'none'
				}); //隐藏账号密码表单，显示详细内容表单
				$('#div_alterEmployee').show();
			}
		}
		function resize() {
			var bodyHeight = parent.$('#iframeHeight').val() * 0.7;
			var bodyWidth = parent.$('#iframeWidth').val();
			$('body').css({
				'height' : bodyHeight,
				'width' : bodyWidth
			});
		}
		function listen() {
			form.on('submit(*)', function() { //提交监听
				var data = formData(); //获取表单数据
				//console.log("listen.data");
				//console.log(data);
				if(operator == 0) {
					//增加
					addEmployee(data);
				}
				if(operator == 1) {
					//编辑
					alterEmployee(data);
				}
				
			});
			
			$('#nextButton').click(function() { //填写用户账号密码后点击下一步
				$('#nextSubmit').click();
			});
			
			form.on('submit(next)', function() { //点击下一步后判断两次密码是否相等，相等则赋值account,pwd
				var pwd = $('input[name="pwd"]').val();
				var pwd2 = $('input[name="pwd2"]').val();
				if (pwd2 != pwd) {
					layer.msg("密码不一致");
				} else {
					$('#accountTable').css({
						'display' : 'none'
					}); //隐藏账号密码表单，显示详细内容表单
					$('#div_alterEmployee').show();
				}
			});
		}
		
		//增加员工数据库操作
		function addEmployee(data) {
			$.ajax({
				data : data,
				type : "POST",
				url : "/Hospital/userController/createEmployee",
				async : false,
				success : function(result) {
					//console.log("listen.result");
					//console.log(result);
					if (result.code == 200) {
						isSuccess = 200;
						setEmpty();
					} else if (result.code == 411) { //账号重复
						isSuccess = 411;
						showAccoutTable();//隐藏详细内容表单，显示账号密码表单
					} else if (result.code == 412) { //工号重复
						isSuccess = 412;
						$("input[name='employeeCode']").val("");
					} else if (result.code == 501) {
						isSuccess = 501;
					}
				}
			});
		}
		
		//编辑员工数据库操作
		function alterEmployee(data) {
			$.ajax({
				type : "post",
				data : data,
				async : false,
				url : "/Hospital/userController/alterEmployee",
				success : function(response) {
					isSuccess =response.code;
					if(response.code != 200) {
						console.error(response);
					}
					//console.log("addEmployee.html/alterEmployee.response");
					//console.log(response);
				}
			});
		}
		
		//清空表单信息
		function setEmpty() {
			//提交后表单清空
			$("input[name='account']").val("");
			$("input[name='pwd']").val("");
			$("input[name='pwd2']").val("");
			$("input[name='name']").val("");
			$("input[name='employeeCode']").val("");
			$("input[name='age']").val("");
			$("select[name='position']").val("");
			$("select[name='department']").val("");
			$("select[name='isOnJob']").val(0);
			$("select[name='isDomain']").val(0);
			showAccoutTable();//隐藏详细内容表单，显示账号密码表单
			form.render();
		}
	});
	
	//隐藏详细内容表单，显示账号密码表单
	function showAccoutTable() {
		$('#accountTable').show(); //隐藏详细内容表单，显示账号密码表单
		$('#div_alterEmployee').css({
			'display' : 'none'
		});
	}
	
	function formData() { //获取表单数据
		var data = {};
		if(operator == 0) {
			//增加
			var clinicId = JSON.parse(localStorage.getItem("loginUser")).clinicId; //获取当前门诊ID
			var account = $("input[name='account']").val();
			var pwd = $("input[name='pwd']").val();
			var name = $("input[name='name']").val();
			var employeeCode = $("input[name='employeeCode']").val();
			var age = $("input[name='age']").val();
			var sex = $("#sex").val();
			var position = $("#positionSelect").val();
			var department = $("select[name='department']").find("option:selected").val();
			var isOnJob = $("select[name='isOnJob']").find("option:selected").val();
			var isDomain = $("select[name='isDomain']").find("option:selected").val();
			var birthdate = $("#birthdate").val();
			data = {
				"name" : name,
				"employeeCode" : employeeCode,
				"clinicId" : clinicId,
				"age" : age,
				"sex" : sex,
				"positionId" : position,
				"departmentId" : department,
				"isDomain" : isDomain,
				"isOnJob" : isOnJob,
				"birthdate" : birthdate,
				"account" : account,
				"pwd" : pwd
			};
		}
		if(operator == 1) {
			//编辑
			var editData = JSON.parse(localStorage.getItem("editTableData"));
			data = {
				employeeId : editData.employeeId,
				positionId : $("#positionSelect").val(),
				clinicId : JSON.parse(localStorage.getItem("loginUser")).clinicId,
				departmentId : $("select[name='department']").find("option:selected").val(),
				employeeCode : $("input[name='employeeCode']").val(),
				birthdate : $("#birthdate").val(),
				name : $("input[name = 'name']").val(),
				age : $("input[name='age']").val(),
				sex : $("#sex").val(),
				isOnJob : $("select[name='isOnJob']").find("option:selected").val(),
				isDomain : $("select[name='isDomain']").find("option:selected").val(),
			};
		}
		console.log("addEmployee.html/formData.data");
		console.log(JSON.stringify(data));
		return data;
	}
	function submit() { //父框点击新增框的新增按钮调用此函数
		$('#submit').click();
		return isSuccess;
	}
	
		
</script>
</html>